.gold-text {
    color: #E7CB13;
}

.category-top h1 {
    text-align: left;
    margin: 1rem auto;
    max-width: 1120px;
}

.category-perex {
    text-align: left;
    max-width: 1120px;
    margin: 0 auto;
}

.category-perex p {
    margin-bottom: 0;
}


.subcategories {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 4rem auto;
    max-width: 1000px;
    gap: 4rem;
    position: relative;
}

.subcategories::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% + 120px);
    height: calc(100% + 50px);
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/custom-categories-bg2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 2rem;
}
.subcategories li {
    width: 100%;
    padding: 0;
    transition: 0.4s ease-in-out;
}

.subcategories.with-image li {
    align-items: unset;
}



.subcategories.with-image li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: end;
    border-radius: 2rem;
    border-style: unset;
    border-width: unset;
    border-color: unset;
   padding: 0;
    border: 2px solid rgba(255, 255, 255,0.2);
   min-height: 28rem;
   transition: all 0.3s ease-in-out;
}



/*odkazy obrazku pro rukavice*/

.subcategories.with-image li a[href="/rukavice-standard/"],.subcategories.with-image li a[href="/en/gloves-standard/"],
.subcategories.with-image li a[href="/pl/rekawice-standard/"]
{
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Rukavice/Rukavice_Standard5.jpg"),  #000000;
    background-repeat: no-repeat;
   background-size: 100% 80%;
}

.subcategories.with-image li a[href="/rukavice-fancy/"], .subcategories.with-image li a[href="/en/gloves-fancy/"],
.subcategories.with-image li a[href="/pl/rekawice-fancy/"]
{
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Rukavice/Rukavice_Fancy5.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/rukavice-grafitti/"], .subcategories.with-image li a[href="/en/gloves-grafitti/"], .subcategories.with-image li a[href="/pl/rekawice-grafitti/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Rukavice/Rukavice_Grafitti_5.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/kozene-boxerske-rukavice/"], .subcategories.with-image li a[href="/en/leather-boxing-gloves/"], .subcategories.with-image li a[href="/pl/skorzane-rekawice-bokserskie/"]  {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Rukavice/Rukavice_Thai5.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}




/*odkazy obrazku pro chranice*/

.subcategories.with-image li a[href="/chranice-standard/"], .subcategories.with-image li a[href="/en/shin-guards-standard/"], .subcategories.with-image li a[href="/pl/ochraniacze-standard/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Chrániče holení/Chrániče_Standard.jpg"),  #000000;
    background-repeat: no-repeat;
   background-size: 100% 80%;
}

.subcategories.with-image li a[href="/chranice-fancy/"], .subcategories.with-image li a[href="/en/shin-guards-fancy/"], .subcategories.with-image li a[href="/pl/ochraniacze-fancy/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Chrániče holení/Chrániče_Fancy.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/chranice-grafitti/"], .subcategories.with-image li a[href="/en/shin-guards-grafitti/"], .subcategories.with-image li a[href="/pl/ochraniacze-grafitti/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Chrániče holení/Chrániče_Grafitti.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/chranice-thai/"], .subcategories.with-image li a[href="/en/shin-guards-thai/"], .subcategories.with-image li a[href="/pl/ochraniacze-thai/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Chrániče holení/Chrániče_Thai.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

/*odkazy obrazku pro trenky*/

.subcategories.with-image li a[href="/trenky-classic/"], .subcategories.with-image li a[href="/en/shorts-classic/"], .subcategories.with-image li a[href="/pl/spodenki-classic/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Trenky/Trenky_Classic2.jpg"),  #000000;
    background-repeat: no-repeat;
   background-size: 100% 80%;
}

.subcategories.with-image li a[href="/trenky-fancy/"], .subcategories.with-image li a[href="/en/shorts-fancy/"], .subcategories.with-image li a[href="/pl/spodenki-fancy/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Trenky/Trenky_Fancy2.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/trenky-double/"], .subcategories.with-image li a[href="/en/shorts-double/"], .subcategories.with-image li a[href="/pl/spodenki-double/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Trenky/Trenky_Double2.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/trenky-thai/"], .subcategories.with-image li a[href="/en/shorts-thai/"], .subcategories.with-image li a[href="/pl/spodenki-thai/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Trenky/Trenky_Thai2.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

/*odkazy obrazku pro vybavení*/

.subcategories.with-image li a[href="/lapy-2/"], .subcategories.with-image li a[href="/en/pads-2/"], .subcategories.with-image li a[href="/pl/lapy-2/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Vybavení do gymu/Lapy.jpg"),  #000000;
    background-repeat: no-repeat;
   background-size: 100% 80%;
}

.subcategories.with-image li a[href="/chranice-a-prilby/"], .subcategories.with-image li a[href="/en/protectors-and-head-guards/"], .subcategories.with-image li a[href="/pl/ochraniacze-i-kaski/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Vybavení do gymu/Chranice a prilby.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}


/*odkazy obrazku pro doplňky*/

.subcategories.with-image li a[href="/bandaze/"], .subcategories.with-image li a[href="/en/bandages/"], .subcategories.with-image li a[href="/pl/bandaze/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Doplňky/Bandaze.jpg"),  #000000;
    background-repeat: no-repeat;
   background-size: 100% 80%;
}

.subcategories.with-image li a[href="/ponozky/"], .subcategories.with-image li a[href="/en/ankle-guards/"], .subcategories.with-image li a[href="/pl/ponozky/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Doplňky/Ponozky.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/obleceni-2/"], .subcategories.with-image li a[href="/en/clothes-and-others-2/"], .subcategories.with-image li a[href="/pl/obleceni-2/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Doplňky/Obleceni a ostatni.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/darkove-poukazy/"], .subcategories.with-image li a[href="/en/darkove-poukazy/"], .subcategories.with-image li a[href="/pl/darkove-poukazy/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Doplňky/Poukazy2.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}


/*odkazy obrazku pro sety*/

.subcategories.with-image li a[href="/sety-s-rukavicemi-10oz/"], .subcategories.with-image li a[href="/en/sety-s-rukavicemi-10oz/"], .subcategories.with-image li a[href="/pl/sety-s-rukavicemi-10oz/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Sety/10_OZ.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/sety-s-rukavicemi-12oz/"], .subcategories.with-image li a[href="/en/sety-s-rukavicemi-12oz/"], .subcategories.with-image li a[href="/pl/sety-s-rukavicemi-12oz/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Sety/12_OZ.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/sety-s-rukavicemi-14oz/"], .subcategories.with-image li a[href="/en/sety-s-rukavicemi-14oz/"], .subcategories.with-image li a[href="/pl/sety-s-rukavicemi-14oz/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Sety/14_OZ.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/sety-s-rukavicemi-16oz/"], .subcategories.with-image li a[href="/en/sety-s-rukavicemi-16oz/"], .subcategories.with-image li a[href="/pl/sety-s-rukavicemi-16oz/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Sety/16_OZ.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

/*odkazy obrazku pro kolekce*/

.subcategories.with-image li a[href="/kolekce-standard/"], .subcategories.with-image li a[href="/en/kolekce-standard/"], .subcategories.with-image li a[href="/pl/kolekce-standard/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Kolekce/Kolekce_Standard.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/kolekce-fancy/"], .subcategories.with-image li a[href="/en/kolekce-fancy/"], .subcategories.with-image li a[href="/pl/kolekce-fancy/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Kolekce/Kolekce_Fancy.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/kolekce-thai/"], .subcategories.with-image li a[href="/en/kolekce-thai/"], .subcategories.with-image li a[href="/pl/kolekce-thai/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Kolekce/Kolekce_Thai.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}

.subcategories.with-image li a[href="/kolekce-graffiti/"], .subcategories.with-image li a[href="/en/kolekce-grafitti/"], .subcategories.with-image li a[href="/pl/kolekce-grafitti/"] {
    background: url("https://www.rajaboxingczech.cz/user/documents/upload/DanielPilař-WEBDESIGN/CUSTOM KATEGORIE/Kolekce/Kolekce_Grafitti.jpg"),  #000000;
    background-repeat: no-repeat;
  background-size: 100% 80%;
}






.subcategories.with-image li a .image {
    height: unset;
    width: unset;
    display:none;
}

.subcategories.with-image li a .image img {
    max-height: unset;
    border-radius:  2rem 2rem 0 0;
}

.subcategories li a::before {
    display: none;
}

.subcategories.with-image li a .text {
    flex-grow: unset;
    width: unset;
    padding: 1.5rem 0;
    font-size: 2.4rem;
    text-align: center;
    white-space: normal;
    min-height: 7rem;
    display: flex;
    align-items: center;
    font-weight: 700;
    color: #FFFFFF;
    transition: all 0.4s ease-in-out;
}

.subcategories li:hover {
    transform: scale(1.1);
}

.subcategories li:hover a .text {
    color: #E7CB13;
}

.subcategories li:hover a {
   border: 2px solid #E7CB13;
}



@media (max-width:1200px) {
    .subcategories.with-image li a {
    
        min-height: 27rem;
       
     
     }
}




@media (max-width: 1150px) {
   
    .subcategories {
        padding: 0 1rem;
    }
    .subcategories::before {
    
        width: 100vw;
        border-radius: unset;
       
       
    }

} 


@media (max-width:1000px) {
    .subcategories.with-image li a {
    
        min-height: 19rem;
       
     }

     .subcategories.with-image li a .text {
        min-height:4rem;
        font-size: 1.8rem;
       
    }

  
}


@media (max-width: 900px) {
    .subcategories {
        padding: 0 1rem;
        grid-template-columns: repeat(3, 1fr);
        gap: 3rem;
    }

    .subcategories.with-image li a {
    
       min-height: 25rem;
      
    
    }


} 

@media (max-width: 600px) {
    .subcategories {
        padding: 0 2rem;
        gap: 1.5rem;
    }

    .subcategories.with-image li a {
    
        min-height: 20rem;
       
     
     }

    .subcategories.with-image li a .text {

        font-size: 1.6rem;
        min-height: 4rem;
       
    }
    
} 


@media (max-width: 480px) {
    .subcategories {
        grid-template-columns:repeat(2, 1fr);
    }
    
} 

@media (max-width: 350px) {
    .subcategories {
        grid-template-columns:repeat(1, 65%);
    }
    
} 

